import QtQuick 1.1
import com.nokia.meego 1.0
import QtMobility.gallery 1.1


Sheet {
    id: gallerySheet;

    acceptButtonText: "Add"
    rejectButtonText: "Cancel"

    property string imageUrl;

    content: GridView {
        id: imageGrid
        anchors.fill: parent
        anchors.margins: 2;

        cellWidth: 170
        cellHeight: 150

        cacheBuffer: 480;

        clip: true;

        model: DocumentGalleryModel {
            rootType: DocumentGallery.Image
            properties: [ "url" ]

            /*
            filter: GalleryWildcardFilter {
                property: "fileName";
                value: "*.jpg";
            }*/
        }

        delegate: Image {
            id: imageDelegate;
            source: url
            width: 170
            height: 150
            fillMode: Image.PreserveAspectCrop
            clip: true
            sourceSize.width: 170

            MouseArea {
                anchors.fill: parent
                onClicked: {
                    imageGrid.currentIndex = index
                    imageUrl = url
                    //gallerySheet.close();
                }
            }

        }

        Component {
            id: highlight
            Rectangle {
                width: imageGrid.cellWidth;
                height: imageGrid.cellHeight
                color: "transparent";
                radius: 6
                border.color: "#80000000"
                border.width: 10
                x: imageGrid.currentItem.x
                y: imageGrid.currentItem.y
                z: 100
                smooth: false;
                opacity: 0.8;

                Behavior on x { PropertyAnimation { easing.type: Easing.InOutQuad; } }
                Behavior on y { PropertyAnimation { easing.type: Easing.InOutQuad;  } }

                Rectangle {
                    anchors.fill: parent;
                    anchors.margins: 3;
                    color: "transparent";
                    radius: 4
                    border.color: "white"
                    border.width: 4
                    z: 0
                }
            }
        }

        highlight: highlight
        highlightFollowsCurrentItem: false;

    }


}

